document.addEventListener('DOMContentLoaded', function () {


    //模拟封装jQuery $
    function $key(getkeys) {
        return document.querySelector(getkeys);
    }


    // 提取日期相关函数
    date();
    function date() {
        var spa = document.querySelector(".dater");
        var timer = null;
        // 封装时间日期格式化
        function mydate() {
            var date = new Date();
            // 时间日期格式化 yyyy-mm-dd hh:mm:ss
            var year = date.getFullYear();
            var month = date.getMonth() + 1;
            var data = date.getDate();
            var hours = date.getHours();
            var minutes = date.getMinutes();
            var seconds = date.getSeconds();
            // 补 0
            month = (month < 10) ? "0" + month : month;
            data = (data < 10) ? "0" + data : data;
            hours = (hours < 10) ? "0" + hours : hours;
            minutes = (minutes < 10) ? "0" + minutes : minutes;
            seconds = (seconds < 10) ? "0" + seconds : seconds;
            var res = `${year}年${month}月${data}日 ${hours}:${minutes}:${seconds}`;
            return res;
        }
        function automove() {
            spa.innerHTML = mydate();
        }
        // 自动走
        setInterval(automove, 1000);
    }


    //添加内容
    var dailytop = document.getElementsByClassName("daily-top")[0];
    dailytop.innerHTML = `
            <div class="Lines"></div>
            <p class="penc">日常</p>
            <input type="date" class="datetime">
            <span class="journal">写日报</span>
    `
    var dailybott = document.getElementsByClassName("daily-bottom")[0];
    dailybott.innerHTML = `
        <table>
              <thead>
                <tr>
                  <th>姓名</th>
                  <th>报告内容</th>
                  <th>日期</th>
                </tr>
              </thead>
              <tbody class="oner"></tbody>
              <tfoot>
                <tr>
                  <th  colspan="3">
                    <button id="uper1">&lt;</button>
                    <div class="age"></div>
                    <button id="nexter1">&gt;</button>
                  </th>
                </tr>
              </tfoot>
            </table>
    `
    var journal = document.getElementsByClassName("journal")[0];
    journal.onclick = function () {
        myModel({
            mask: true,//显示蒙版
            title: "日报",//标题
            content_item1: `
                        <div class="userupdate">
                            <div class="left">
                                <div class="name">姓名: <input type="text" id="dailyParperUserName"></div>
                            </div>
                            <div class="right">
                            <div class="userphone name">日期: <input type="date" id="dailyParperDate"></div>
                            </div>
                        </div>
                        <div class="ctent"><span class="ctent_1">内容:</span><input type="text" id="dailyParperContent"></div>
                    `,
            fun: function () {
                // 执行添加的函数
                add()
            }
        })
    }
    function add() {
        var data = {
            dailyParperUserName: Number(localStorage.getItem("userId")),
            dailyParperContent: document.getElementById("dailyParperContent").value,
            dailyParperDate: document.getElementById("dailyParperDate").value,
        }
        console.log(data);
        ajax.post(baseUrl.myUrl + "daily/dailyList", data, function (res) {
            console.log(res);
            if (res.code == 200) {
                // alert("");
                dailyyList()
            }
        })
    }

    //AJAX调接口
    var pageIndex = 1;
    var pageSize = 3;
    function dailyyList() {
        $key(".oner").innerHTML = " ";
        $key(".age").innerHTML = " ";
        var hjx = {// 调接口
            pageIndex: pageIndex,
            pageSize: pageSize,
        }
        ajax.post("http://192.168.199.101:8080/BaorSystem/daily/dailyList", hjx, function (res) {
            if (res.code == 200) {
                console.log(res);
                pageCount = res.dataset.pageCount;
                for (var i = 0; i < pageCount; i++) {
                    //创建元素
                    btn = document.createElement("button");
                    btn.innerHTML = i + 1;
                    var age = document.getElementsByClassName("age")[0];
                    age.appendChild(btn);
                }
                for (var item of res.dataset.dailyList) {
                    var newTr = document.createElement("tr");// 创建元素
                    newTr.innerHTML = `
                        <td>${item.dailyParperUserName}</td>
                        <td>${item.dailyParperContent}</td>
                        <td>${item.dailyParperDate}</td>
                    `;
                    $key(".oner").appendChild(newTr);
                }
            }
        })
    }
    dailyyList();
    pagination()


    //分页
    function pagination() {
        $key("#nexter1").onclick = function () {//下一页
            pageIndex++;
            if (pageIndex >= pageCount) {
                pageIndex = pageCount;
                this.disabled = true;
            }
            $key("#uper1").disabled = false;
            // btn.style.backgroundColor="red";
            dailyyList();
        }
        $key("#uper1").onclick = function () {//上一页
            pageIndex--;
            if (pageIndex <= 1) {
                pageIndex = 1;
                this.disabled = true;
            }
            $key("#nexter1").disabled = false;
            dailyyList();
        }
    }


    //切换
    var lis = document.getElementsByClassName("lis");
    var ps = document.getElementsByClassName("nav_p");
    var jt1p = document.getElementsByClassName("jt1")[0];
    var attendance = document.getElementsByClassName("attendance")[0];
    var attendance1 = document.getElementsByClassName("attendance1");
    var ff = 0;
    for (let i = 0; i < lis.length; i++) {
        lis[i].addEventListener('click', function () {
            for (let j = 0; j < lis.length; j++) {
                if (lis[j] === this) {
                    lis[j].style.backgroundColor = "#E7F0F7";
                    lis[j].style.borderRight = "3px solid #0161AD";
                    lis[j].style.color = "#1569B0";
                    if (j === 1) {
                        jt1p.style.display = "inline-block";
                        jt1p.onclick = function () {
                            if (ff == 0) {
                                ff = 1;
                                attendance.style.display = "block";
                                jt1p.src = "./image/下箭头.png";
                                attendance1[0].style.color = "#000";
                            } else {
                                attendance.style.display = "none";
                                jt1p.src = "./image/右箭头蓝.png";
                                jt1p.style.display = "block";
                                ff = 0;
                            }
                        }
                    }
                } else {
                    if (j === 1) {
                        jt1p.style.display = "none";
                        attendance.style.display = "none";
                    }
                    lis[j].style.backgroundColor = "";
                    lis[j].style.borderRight = "";
                    lis[j].style.color = "";
                    for (let k = 0; k < ps.length; k++) {
                        ps[k].style.display = "none";
                    }
                }
            }
        });
    }


    //日期框默认显示
    var datetime = document.getElementsByClassName("datetime")[0];
    datetime.valueAsDate = new Date();


    //页面跳转
    //班级管理
    var classs = document.getElementsByClassName("classs");
    classs[0].onclick = function () {
        location.href = "./ClassManagement.html";
    }
    //日常
    // var routine = document.getElementsByClassName("routine")[0];
    // routine.onclick = function () {
    //     location.href = "./daily.html";
    // }
    //系统设置
    var system = document.getElementsByClassName("system")[0];
    system.onclick = function () {
        location.href = "./setting.html";
    }
    //项目管理
    var project = document.getElementsByClassName("project")[0];
    project.onclick = function () {
        location.href = "./projectmanagement.html";
    }
    //出差记录
    var travel = document.querySelector(".travel");
    travel.addEventListener('click', function () {
        location.href = "./business.html";
    });
    //请假记录
    var excused = document.querySelector(".excused");
    excused.addEventListener('click', function () {
        location.href = "./vacate.html";
    });
    //考勤记录
    var presence = document.querySelector(".presence");
    presence.addEventListener('click', function () {
        location.href = "./clock.html";
    });
});